<template v-if="ablumCards.length">
  <div class="page-music-ablum">
    <template v-for="card in ablumCards" :key="card.id">
      <CardItem :item="card" v-bind="configObj">
        <template #musictop>
          <div></div>
        </template>
      </CardItem>
    </template>
  </div>
</template>

<script setup>
import { defineProps } from 'vue'
import CardItem from '@/base-ui/card-item'

const props = defineProps({
  ablumCards: {
    type: Array,
    default: () => []
  }
})

const configObj = {
  wth: '150px',
  topShow: false,
  imgUrl: 'picUrl',
  albumType: true
}
</script>

<style lang="less" scoped>
.page-music-ablum {
  display: flex;
  width: 95%;
  margin: 0 auto;
  justify-content: space-around;
  flex-wrap: wrap;
}
</style>
